<template>
  <div id="app">
    <topBar v-if="loginStatus==0" v-bind:selected = "selected" v-on:tselect = "tselect($event)"/>
    <adminTopBar v-if="loginStatus==1" v-bind:selected = "selected" v-on:tselect = "tselect($event)"/>
	<router-view/>
  </div>
</template>

<script>
import topBar from './components/topBar.vue'
import adminTopBar from './components/admin/topBar.vue'
import config from '../config.js'


export default {
  name: 'app',
  components: {
    topBar,
	adminTopBar
  },
  data(){
	  return{
		selected:1,
		loginStatus:this.$root.loginStatus,
		localhost:config.localhost,
		port:config.port
	  }
  },  
  computed: {
    
  },
  mounted:function(){
	 // 检查登录状态
	 let api='http://'+this.localhost+':'+ this.port+'/logcheck',
		 token = this.$root.token;
	 this.$http.get(api,{params: {token:token}}).then((response)=>{
	 	console.log('ApponLoad',response,token);
		//判断是否已登录
		if(this.$root.loginStatus != response.body.login){
			window.localStorage.setItem('username',response.body.username);
			this.$root.username= response.body.username;
			window.localStorage.setItem('loginStatus',response.body.login);
			this.$root.loginStatus= response.body.login;
			if(response.body.login == 0){
				window.localStorage.removeItem('username');
				this.$root.username= undefined;
				window.localStorage.removeItem('loginStatus');
				this.$root.loginStatus= undefined;
				this.$router.push('/');
				this.$router.go(0);
			}else{
				this.$router.go(0);
			}
		}
	 },function(err){
	 	console.log(err);
	 })
  },
  destroyed:function(){
	  console.log('destroyed');
  },
  methods:{
	  tselect(msg){
		  this.selected = msg;
		  console.log(msg);
	  },
	   handle(value, render) {
	       this.myhtml = render;
	       console.log(value, render);
	  }
	 
  }
}
</script>

<style>
#app {
  font-family: 'Avenir', Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  /* margin-top: 0.3125rem; */
  background-image: url(assets/star2.jpeg);
  background-size: cover;
  background-repeat: no-repeat;
  width: 100%;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  /* position: fixed; */
}
#main{
	display: flex;
	flex-direction: row;
	width: 80%;
	margin-left: 5%;
	margin-top: 6.25rem;
}

</style>
